import React from 'react';
import { connect } from 'react-redux';
import { BROWSER_MODE } from 'Constants/webConstants';
import './index.scss';

class Header extends React.PureComponent {
  render() {
    const { mode } = this.props;
    const isVertical = BROWSER_MODE.isVertical(mode);
    return (
      <div className={`${isVertical ? 'v-' : ''}header-wrapper`} >
        <div className="header">
          <div className="logo">
            <img src="images/logo.png" alt="logo" />
          </div>
          <div className="web-name">
            <img src="images/title.png" alt="title" />
          </div>
        </div>
        <img className="header-right-img" src="images/icon_baozi.png" alt="包子铺" />
      </div>
    );
  }
}

function mapStateToProps(state) {
  return {
    ...state.webReducer,
  };
}

export default connect(mapStateToProps)(Header);
